<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_fragment::head(~{::title},~{::style})">
    <title>日记----记录日常点滴</title>
    <style>
    </style>
</head>
<body>
<!-- 头部导航栏 -->
<div th:replace="~{_fragment::blog-header('timeline')}"></div>

<!-- 内容区 -->
<div class="blog-content">
    <div class="layui-container">
        <div class="layui-row">
            <div class="base-card">
                <div class="base-card-header" style="text-align: center;">
                    <span class="fa fa-hourglass-half" style="font-size: 25px;">&nbsp;时间轴----记录日常点滴</span>
                </div>
                <div class="base-card-body">
                    <div class="timeline">
                        <ul class="layui-timeline">
                            <li class="layui-timeline-item" id="timeline-top">
                                <i class="layui-icon layui-timeline-axis log-icon">&#xe60e;</i>
                                <div class="layui-timeline-content layui-text animated bounceInRight">
                                    <h3 class="layui-timeline-title">目前共有<span id="record-count">0</span>条记录</h3>
                                </div>
                            </li>

                            <li class="layui-timeline-item" id="timeline-bottom">
                                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                                <div class="layui-timeline-content layui-text animated bounceInRight">
                                    <h3 class="layui-timeline-title"><a href="javascript:;" id="record-more">更早记录...</a></h3>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 底部版权区 -->
<div th:replace="_fragment::blog-footer"></div>
</body>
<script id="contentTpl" type="text/html">
    {{#  layui.each(d,function(index,item){  }}
    <li class="layui-timeline-item">
        <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
        <div class="layui-timeline-content layui-text animated bounceInRight delay-{{index}}s">
            <h3 class="layui-timeline-title">{{item.createTime}}</h3>
            {{item.content}}
        </div>
    </li>
    {{#    });     }}

</script>
<script type="text/javascript" th:src="@{/js/global.js}"></script>
<script type="text/javascript" th:src="@{/js/timeline.js}"></script>
<link rel="stylesheet" type="text/css" th:href="@{/css/timeline.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/css/timeline.css}"/>

</html>
